<template>
    <popup
        title="知识库详情"
        :show="showEdit"
        :loading="loading"
        :async-close="true"
        confirmButtonText=""
        cancelButtonText=""
        width="560px"
        @close="emits('close')"
    >
        <div class="p-6">
            <el-form
                ref="formRef"
                :model="formData"
                :rules="formRules"
                :disabled="true"
                label-width="90px"
            >
                <el-form-item label="知识库图标" prop="logo">
                    <material-picker v-model="formData.logo" :limit="1" />
                </el-form-item>
                <el-form-item label="知识库编号" prop="code">
                    <el-input v-model="formData.code" />
                </el-form-item>
                <el-form-item label="知识库名称" prop="name">
                    <el-input
                        v-model="formData.name"
                        placeholder="请输入知识库名称"
                        maxlength="100"
                    />
                </el-form-item>
                <el-form-item label="知识库简介" prop="intro">
                    <el-input
                        v-model="formData.intro"
                        placeholder="请输入知识库简介"
                        maxlength="800"
                        type="textarea"
                        :rows="5"
                    />
                </el-form-item>
                <el-form-item label="向量模型" prop="vector_model">
                    <models-select
                        v-model="formData.vector_model"
                        type="vector"
                    />
                </el-form-item>
                <el-form-item label="拆分模型" prop="splits_model">
                    <models-select
                        v-model="formData.splits_model"
                        type="chat"
                    />
                </el-form-item>
                <el-form-item label="创建时间" prop="create_time">
                    <el-input v-model="formData.create_time" />
                </el-form-item>
                <el-form-item label="更新时间" prop="update_time">
                    <el-input v-model="formData.update_time" />
                </el-form-item>
                <el-form-item label="状态">
                    <el-radio-group v-model="formData.is_disable">
                        <el-radio :value="0">正常</el-radio>
                        <el-radio :value="1">禁用</el-radio>
                    </el-radio-group>
                </el-form-item>
            </el-form>
        </div>
    </popup>
</template>

<script setup lang="ts">
import agentKnowApi from '@/api/agent/know/manage'

const emits = defineEmits(['close'])

const formRef = ref()
const showMode = ref<string>('add')
const showEdit = ref<boolean>(false)

// 表单数据
const loading = ref<boolean>(false)
const formData: any = reactive({
    id: 0,            // ID
    code: '',         // 编号
    logo: '',         // 图标
    name: '',         // 名称
    intro: '',        // 简介
    vector_model: '', // 向量模型
    splits_model: '', // 拆分模型
    is_disable: 0,    // 是否禁用:[0=否, 1=是]
    create_time: '',  // 创建时间
    update_time: ''   // 更新时间
})

// 表单规则
const formRules: any = reactive({
    logo: [
        { required: true, message: '请上传知识库图标', trigger: 'blur' },
        { max: 250, message: '图标链接不能大于250个字符', trigger: 'blur' }
    ],
    code: [
        { required: true, message: '知识库编号不能为空', trigger: 'blur' },
        { max: 32, message: '知识库编号不能大于32个字符', trigger: 'blur' }
    ],
    name: [
        { required: true, message: '知识库名称不能为空', trigger: 'blur' },
        { max: 32, message: '知识库名称不能大于32个字符', trigger: 'blur' }
    ],
    intro: [
        { required: true, message: '知识库简介不能为空', trigger: 'blur' },
        { max: 800, message: '知识库简介不能大于800个字符', trigger: 'blur' }
    ],
    vector_model: [
        { required: true, message: '请选择向量训练模型', trigger: 'blur' }
    ],
    splits_model: [
        { required: true, message: '请选择文件处理模型', trigger: 'blur' },
    ]
})

/**
 * 打开表单
 *
 * @param {string} type
 * @param {any} row
 * @returns {Promise<void>}
 */
const open = async (type: string, row?: any): Promise<void> => {
    showMode.value = type
    showEdit.value = true

    if (type === 'detail') {
        const data = await agentKnowApi.detail(row.id)
        for (const key in formData) {
            if (data[key] !== null && data[key] !== undefined) {
                formData[key] = data[key]
            }
        }
    }
}

defineExpose({
    open
})
</script>
